<template>
	<!-- 增加检查 -->
	<view>
		<view class="maggview">基本信息</view>
		<view class="maggfist">
			<view class="cvie">
				<view style="flex: 1;">检查日期</view>
				<view  style="flex: 1;text-align: right;">{{nowTime}}</view>
			</view>
			<view style="background-color: #B2B2B2;height: 1rpx;flex: 1"></view>
			<view class="cvie" >
				<view style="flex: 1;">责任人</view>
				<view class="iconfont" style="flex: 1;text-align: right;" 
				@click="byPersonCharge"> {{personCharge==null?'请选择':personCharge.name}}  &#xe610; </view>
			</view>
		</view>
		
		
		<view class="maggview" style="display: flex;">
		   <view style="flex: 1;">告知人</view> <view style="flex: 1;text-align: right;">已选择{{userList.length}}人</view>
		</view>
		<view class="maggtwo" >
			<image src="../../static/images/add.png" @click="byPersonGao"></image>
			<image :src="item.imgPath" v-for="item in userList"></image>
		</view>
		
		
		<view class="maggview">检查信息</view>
		<view class="maggthree" style="display: flex;">
		   <view style="flex: 1;">检查项及结果</view>
			<view class="iconfont" style="flex: 1;text-align: right;" @click="threShow">请选择&#xe610;</view>
		</view>
		<!-- 树插件 -->
		<tki-tree ref="tkitree" :selectParent="selectParent" :multiple="multiple" :range="list" 
		rangeKey="title" @confirm="treeConfirm" @cancel="treeCancel"></tki-tree>
		
		<view class="maggthree-check" v-for="item in listfoet">{{item.title}}</view>
		<view class="maggthree-result" v-if="listfoet.length>0">
			<view style="flex: 2;">输入检查结果:</view>
			<view  style="flex: 4;padding-top: 11rpx;">
				<input v-model="cheeckResult"/>
			</view>
		</view>
		

		<view class="maggview">添加照片</view>
		<view class="maggfour" >
			<image src="../../static/images/add2.png" @click="getImage"></image>
			<image :src="val + item.imgPath" v-for="item in fileImg"></image>
		</view>
		
		
		<view class="maggview">处理意见</view>
		<view class="maggfive" >
			<view @click="getmfs(1,'通过')" :class="[maggfiveState==1?'maggfivecolor':'maggfivecolor2']">通过</view>
			<view @click="getmfs(2,'警告')" :class="[maggfiveState==2?'maggfivecolor':'maggfivecolor2']">警告</view>
			<view @click="getmfs(3,'整改')" :class="[maggfiveState==3?'maggfivecolor':'maggfivecolor2']">整改</view>
		</view>
		
		<view class="maggview">备注</view>
		
		<textarea  auto-height v-model="remarks"/>
		           
		
		
	</view>
</template>

<script>
	import tkiTree from '@/components/tki-tree/tki-tree.vue';
	let _this;
	
	export default {
		components: {
			tkiTree
		},
		data() {
			return {
				title:"",
				nowTime:"",
				optionInfo:{}, //接收上个页面的值
				userList:[]  ,//已选择告知人人员
				fileImg:[],  //已经选择的照片
				maggfiveState:0 ,//默认0  //处理意见
				maggfiveName:"" , //处理意见 中文
				personCharge:null ,//选中的责任人
				imgList: [],
				imgMaxNum: 9,
				val:"" ,//请求ip
				list: [], //检查项全部的数据
				listfoet:[], //已选择的检查项数据
				multiple:true, //是否可以多选
				selectParent:false, //是否可以选中父元素
				cheeckResult:""  ,//检查项结果
				remarks:""   //备注
			}
		},
		onLoad(option){
			_this=this;
			console.log(option);
			this.optionInfo=option;
			this.val = uni.getStorageSync("pathHost");
			
			this.nowTime=this.getTime();
			setInterval(function(){
				_this.nowTime=_this.getTime();
			},1000)
			if(option.type==1){
				_this.title="添加质量";
			}else{
				_this.title="添加安全";
			}
			if(option.check==1){
				_this.title=_this.title+"分项检查";
			}else{
				_this.title=_this.title+"日常检查";
			}
			 uni.setNavigationBarTitle({
			       title:_this.title
			 }); 
			
			 setTimeout(()=>{
				//this.list = testList;
			    _this.getChenkList();
			}, 600) ;
			
		},
		onShow(){
			_this.$eventHub.$on('fire', function (data) {
			 	//console.log('fire - '+JSON.stringify(data));
				_this.personCharge=data;
				_this.$eventHub.$off('fire');
				_this.$eventHub.$off('fires');
			});
			_this.$eventHub.$on('fires', function (data) {
				_this.userList=data;
				_this.$eventHub.$off('fires');
				_this.$eventHub.$off('fire');
			});
			
		},
		//监听导航栏 点击事件
		onNavigationBarButtonTap(e) {
		   if(_this.personCharge==null){
			   uni.showToast({
			   	title: '责任人不能为空',
			   	icon: "none",
			   	mask: true,
			   	duration: 1600
			   }); 
			   return false;
		   }
		   if(_this.userList.length<=0){
		   			   uni.showToast({
		   			   	title: '告知人不能为空',
		   			   	icon: "none",
		   			   	mask: true,
		   			   	duration: 1600
		   			   }); 
		   			   return false;
		   }
		   
		   if(_this.maggfiveState==0 || _this.listfoet.length<=0 || _this.cheeckResult==""){
		   			   uni.showToast({
		   			   	title: '必填项不能为空',
		   			   	icon: "none",
		   			   	mask: true,
		   			   	duration: 1600
		   			   }); 
		   			   return false;
		   }
		   
		   
		   
			let imlist="",uslist="",usName="",listfoetName="";
			for (var i = 0; i < _this.fileImg.length; i++) {
				imlist=imlist+_this.fileImg[i].imgPath+"|";
			}
			if(imlist!=null && imlist!=""){
				imlist = imlist.substring(0,imlist.lastIndexOf('|'));
			}
			for (var i = 0; i < _this.userList.length; i++) {
				uslist=uslist+_this.userList[i].id+",";
				usName=usName+_this.userList[i].name+",";
			}
			if(uslist!=null && uslist!=""){
				uslist = uslist.substring(0,uslist.lastIndexOf(','));
				usName = usName.substring(0,usName.lastIndexOf(','));
			}
			for (var i = 0; i < _this.listfoet.length; i++) {
				listfoetName=listfoetName+_this.listfoet[i].title+',';
			}
			if(listfoetName!=null && listfoetName!=""){
				listfoetName = listfoetName.substring(0,listfoetName.lastIndexOf(','));			
			}
			
			console.log(_this.nowTime)
			 const value = uni.getStorageSync("JSESSIONID");
			 let url="";
			 if(_this.optionInfo.type==1){
				 url=_this.val+'/ggcapp/qualitycontrols/checkinfoquality/checkInfoQuality/save'+";JSESSIONID="+value+"?__ajax=true&mobileLogin=true";
			 }else if(_this.optionInfo.type==2){
				  url=_this.val+'/ggcapp/safetymanagement/checkinfo/checkInfo/save'+";JSESSIONID="+value+"?__ajax=true&mobileLogin=true";
			 } 
			 uni.request({
				url: url,
				data:{
					"checkDate":_this.nowTime,
					"dutyPerson":_this.personCharge.id,
					"checkEntry":_this.listfoet,
					"checkRemark":_this.remarks,
					"checkResult":_this.cheeckResult,
					"handingSuggestion":_this.maggfiveName,
					"nunciator":uslist,
					"rectificationState": _this.maggfiveState==3?1:0,
					"image":imlist,
					"type":_this.optionInfo.check, //分项或日常
					"nunciatornamelist":usName,
					"remarks":listfoetName
					
				},
				success(data) {						
				// console.log(data)
				 if(data.data.success){
					 uni.showToast({
					 	title: '添加成功',
					 	icon: "none",
					 	mask: true,
					 	duration: 1600
					 }); 
					 setTimeout(function(){
						 uni.navigateBack({
						     delta: 1,					
						     animationDuration: 400
						 });
					 },1600); 
				 }
				}
			}) 
		},
		methods: {
			///将id和pid的数据格式转成children树数据格式
			ztree:function(data){
				 var formatdata=[];
				 for(var i in data){     // pId为0时表示为根节点
				     if(data[i].parent=='#'){
				         var tempObject={};
				         tempObject.title=data[i].text;
				         tempObject.id=data[i].id;
				         tempObject.children=getChildren(tempObject.id);
				         formatdata.push(tempObject);
				     }
				 }
				 function getChildren(id){    //递归体  即对每条data逐条递归找children
				     var tempArray=[];
				     for(var i in data){
				         if(data[i].parent==id){
				             var tempChild={};
				             tempChild.title=data[i].text;
				             tempChild.id=data[i].id;
				             if(selectChildren(data[i].id)){   //若存在子节点，继续递归；否则为叶节点，停止递归
				                 tempChild.children=getChildren(data[i].id);
				             }
				             tempArray.push(tempChild);
				         }
				     }
				     return tempArray;
				 }
				 function selectChildren(id){   // 是否存在子节点
				     for(var i in data){
				         if(data[i].parent==id){
				             return true;
				         }
				     }
				     return false;
				 }
				
				  // console.log(formatdata);
				 return formatdata;
				
			},
			//获取全部检查项
			getChenkList(){
				 const value = uni.getStorageSync("JSESSIONID");
				console.log("===================")
					console.log(_this.optionInfo.type)
					let urlPats="";
					if(_this.optionInfo.type==1){
						urlPats="/ggcapp/qualitycontrols/qualitycontrol/qualityControl/treeData";
					}else if(_this.optionInfo.type==2){
						urlPats="/ggcapp/safetymanagement/checkmaintenancelist/checkMaintenanceList/treeData";
					}
				uni.request({
					url: _this.val+''+urlPats+";JSESSIONID="+value+"?__ajax=true&mobileLogin=true&pageSize=999&ty="+_this.optionInfo.check ,
					success(data) {						
					 
					// console.log(data)
					 var le = _this.ztree(data.data);
					 /* console.log(le) 
					 console.log("dsdfsfd") */
					  _this.list=[];
					  _this.list=le;
					  // console.log(_this.list)
					 // 
					}
				})
				
				
				
			},

			// 检查项确定回调事件
			treeConfirm(e){
				//console.log(e)
			    _this.listfoet=e;
			
			},
			// 检查项取消回调事件
			treeCancel(e){
				//console.log(e)
			},
			// 显示树形选择器
			threShow:function(){
				this.$refs.tkitree._show();
			},
			//添加图片
			getImage:function(){
				    const value = uni.getStorageSync("JSESSIONID")
					
				uni.chooseImage({
								count: 9, //默认9
								sizeType: ['original'], //可以指定是原图还是压缩图，默认二者都有
								sourceType: ['camera','album'], //从相机、相册选择
								success: (res) => {
									var tempFilePaths = res.tempFiles;//tempFilePaths获取是undefined
									if (_this.imgList.length+tempFilePaths.length > _this.imgMaxNum) {
										uni.showToast({
											title: '超过上传图片的最大数量',
											icon: 'none'
										})
									} else {
										if (_this.imgList.length != 0) {
											_this.imgList = _this.imgList.concat(res.tempFilePaths);
										} else {
											_this.imgList = res.tempFilePaths;
										}
										for (var i = 0; i < tempFilePaths.length; i++) {
											//console.log( tempFilePaths[i])
											 uni.uploadFile({
												url: _this.val + "/ggcapp/sys/file/webupload/upload"+";JSESSIONID="+value+"?__ajax=true&mobileLogin=true&pageSize=999&uploadPath=/appFile",
												filePath: tempFilePaths[i].path, //改成tempFiles后需要点path才能获取文件路径
												name: "file", // 一定要与后台@RequestParam("file") MultipartFile变量名一致
												success(res) {
													//console.log(res);
													let obj=JSON.parse(res.data);
													if(obj.success){
														_this.fileImg.push({
															imgPath: obj.body.url
														})
													}
													
												}
											}); 
										}
									}
								}
							});
			},
			//告知人
			byPersonGao:function(){
				let ulist=[];
				for (var i = 0; i < _this.userList.length; i++) {
					ulist.push(_this.userList[i].id);
				}
				uni.navigateTo({
					url: '../newCheck/selectUser?type=2&ulist='+ulist
				}) 
			},
			//责任人
			byPersonCharge:function(){
				uni.navigateTo({
					url: '../newCheck/selectUser?type=1'
				}) 
			}
			,
			getmfs:function(e,n){
				_this.maggfiveState=e;
	            _this.maggfiveName=n;
			},
			getTime:function(){
			
			var date = new Date(),
			year = date.getFullYear(),
			month = date.getMonth() + 1,
			day = date.getDate(),
			hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
			minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(),
			second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
			month >= 1 && month <= 9 ? (month = "0" + month) : "";
			day >= 0 && day <= 9 ? (day = "0" + day) : "";
			var timer = year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second;
			var timer2 = year + '-' + month + '-' + day + ' ';
			return timer;
			}
		}
	}
</script>

<style>

   .maggview{
	 padding-left: 50rpx;
	  padding-right: 50rpx;
	 padding-top: 20rpx;
	 padding-bottom: 20rpx;
	 font-size: 20rpx;
	 color: #BBBBBB;
   }
   .maggfist{
	   background-color: white;
	   height: 200rpx;
	   display: flex;
	   flex: 101;
	   flex-direction:column;
	   padding-left: 50rpx;
	   padding-right: 50rpx;
   }
   .cvie{
	   flex: 50;
	   line-height: 100rpx;
	   //text-align: center;
	   display: flex;
   
   }

	.maggtwo{
		
		min-height: 200rpx;
		background-color: white;
		padding: 20rpx 30rpx 20rpx 30rpx;
		overflow-y: auto;
		
	}
     .maggtwo>image{
		 float: left;
         width: 90rpx;
		height: 90rpx;
		border-radius: 50%;
		margin: 10rpx;
	 }
    .maggthree{
		background-color: white;
		height: 70rpx;
		line-height: 70rpx;
		padding: 0rpx 50rpx 0rpx 50rpx;
	}
	
	.maggthree-check{
		background-color: white;
		height: 70rpx;
		line-height: 70rpx;
		padding: 0rpx 50rpx 0rpx 100rpx;
		
	}
	.maggthree-result{
		display: flex;
		background-color: white;
		height: 70rpx;
		line-height: 70rpx;
		padding: 0rpx 50rpx 0rpx 50rpx;
	}
	
	.maggfour{
		background-color: white;
		min-height: 200rpx;
		padding: 20rpx 30rpx 20rpx 30rpx;
		overflow-y: auto;
		
	}
	.maggfour>image{
		float: left;
	    width: 90rpx;
		height: 90rpx;
		border-radius: 4rpx;
		margin: 10rpx;
	}
	.maggfive{
		background-color: white;
		min-height: 160rpx;
	     padding: 20rpx 50rpx 20rpx 50rpx;
		text-align: center;
	}
    .maggfive>view{
		float: left;
		width: 90rpx;
		height: 90rpx;
		border-radius: 50%;
		margin: 0 7% 0 10%;
		background-color: #DCDEE2;
		line-height: 90rpx;
	}
	.maggfivecolor{
		background-color: #007AFF !important;
		color: white;
	}
	.maggfivecolor2{
		background-color: #DCDEE2;
		color: #000000;
	}
	textarea{
		background-color: white;
		min-height: 100rpx;
		width: 100%;
		padding: 10rpx 50rpx 10rpx 50rpx;
	}


</style>
